<template>
  <div :class="[dialogShow ? 'page_body dialog_show' : 'page_body']">
    <div class="user_center_body">
      <div class="coach_user_center_top">
        <div class="coach_user_center_top_box">
          <div class="coach_user_center_top_box_l">
            <div class="coach_user_center_top_name">
              {{
                userData.name == "" || userData.name == null
                  ? "   "
                  : userData.name
              }}
            </div>
            <div class="coach_user_center_top_phone">{{ phoneShow }}</div>
          </div>
          <div class="user_center_img_box">
            <img
              v-if="userData.avatarurl == '' || userData.avatarurl == null"
              class="user_center_img"
              src="../../assets/image/base_user_img01.png"
              alt="头像"
            />
            <img
              class="user_center_img"
              v-else
              :src="userData.avatarurl"
              alt="头像"
            />
          </div>
        </div>
      </div>

      <div class="user_center_content">
        <!-- 功能框 -->
        <div class="btn_item_box" @click="toMyEnroll()">
          <img
            class="btn_item_title_icon"
            src="../../assets/image/user_center_btn_icon01.png"
          />
          <div class="btn_item_title">我的报名</div>
        </div>

        <!-- <div class="btn_item_box">
          <img
            class="btn_item_title_icon"
            src="../../assets/image/user_center_btn_icon02.png"
            style="width: 0.54rem"
          />
          <div class="btn_item_title">我的荣誉</div>
        </div> -->

        <div class="btn_item_box" @click="toUserInfo()">
          <img
            class="btn_item_title_icon"
            src="../../assets/image/user_center_btn_icon03.png"
            style="width: 0.64rem"
          />
          <div class="btn_item_title">我的信息</div>
        </div>
      </div>
    </div>
    <!-- 提示框 -->
    <div class="dialog_block" v-if="dialogShow">
      <div class="dialog_block_box">
        <img
          class="dialog_block_close"
          src="../../assets/image/close_icon01.png"
          @click="closeDialog()"
        />
        <div class="login_dialog_content">
          <div class="login_dialog_content_title">提示</div>
          <div class="login_dialog_content_title">您还没有完善信息</div>
          <div class="login_dialog_content_tips">
            <img
              class="login_dialog_content_tips_icon"
              src="../../assets/image/warning_icon01.png"
              alt=""
            />
            <div class="login_dialog_content_tips_words">
              完善信息后才能浏览其他内容
            </div>
          </div>
          <div class="login_dialog_content_btn" @click="toRegister()">
            去完善
          </div>
        </div>
      </div>
    </div>
    <HomeFooter :activeKey="activeKey" :systemKey="systemKey"></HomeFooter>
  </div>
</template>
<style src="../../assets/css/user/coachUserCenter.css" scoped></style>

<script>
import HomeFooter from "@/components/homeFooter.vue";
import { Toast } from "mint-ui";

export default {
  name: "CoachUserCenter",
  components: {
    HomeFooter,
  },
  data() {
    return {
      activeKey: 2,
      systemKey: 1,
      topTitle: "个人信息",
      userId: "",
      userData: {
        name: "",
        describe: "",
        avatarurl: "",
        phone: "",
      }, // 用户信息
      dialogShow: false, // 弹窗显示
      phoneShow: "",
      is_complete: "",
    };
  },
  created: function () {
    this.getUserDataFn();
  },
  methods: {
    // 查询用户数据
    getUserDataFn: function () {
      let that = this;
      let url = "/mobile/personalinfo";
      let data = {};
      this.axios
        .post(url, data)
        .then((response) => {
          if (response.code == 0) {
            that.getCoachInfo();
            that.userData = response.userinfo;
            let be = response.userinfo.phone.substring(0, 3);
            let af = response.userinfo.phone.substring(
              9,
              response.userinfo.phone.length
            );
            that.phoneShow = be + "******" + af;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    // 是否完善信息
    getCoachInfo() {
      let url = "/mobile/checkUserInfo";
      this.axios.post(url).then((res) => {
        console.log(res, "res");
        if (res.code == 0) {
          this.is_complete = res.is_complete;
        }
      });
    },
    // 我的报名
    toMyEnroll: function () {
      let key = this.is_complete;
      console.log("getCoachInfo", key);
      if (key == "2") {
        this.$router.push({
          name: "CoachEnrollHistoryList",
        });
      } else {
        this.openDialog();
      }
    },
    // 前往完善信息
    toRegister: function () {
      this.$router.push({
        name: "CoachImprove",
      });
    },
    // 显示弹窗
    openDialog: function () {
      this.dialogShow = true;
    },
    // 关闭弹窗
    closeDialog: function () {
      this.dialogShow = false;
    },
    // 我的信息
    toUserInfo: function () {
      this.$router.push({
        name: "UserInfo",
        query: {
          source: "coachCenter",
        },
      });
    },
  },
};
</script>
